<template>
  <div>
    <div>
      <p>
        <el-text style="color: #999">客户简称：</el-text>
        <el-text style="color: #333">
          {{ CustomerInfos.CustomerName }}
        </el-text>
      </p>
      <p>
        <el-text style="color: #999">客户全称：</el-text>
        <el-text style="color: #333">
          {{ CustomerInfos.CustomerAllName }}
        </el-text>
      </p>
      <p>
        <el-text style="color: #999">所属区域：</el-text>
        <el-text style="color: #333">{{ CustomerInfos.CityShow }}</el-text>
      </p>
      <p>
        <el-text style="color: #999">地址：</el-text>
        <el-text style="color: #333">{{ CustomerInfos.Address }}</el-text>
      </p>
      <p>
        <el-text style="color: #999">电话：</el-text>
        <el-text style="color: #333">
          {{ CustomerInfos.Telphone }}
        </el-text>
      </p>
      <p>
        <el-text style="color: #999">负责人：</el-text>
        <el-text style="color: #333">
          {{ CustomerInfos.LegalPerson }}
        </el-text>
      </p>
      <p>
        <el-text style="color: #999">业务联系人：</el-text>
        <el-text style="color: #333">
          {{ CustomerInfos.LegalPerson }} {{ CustomerInfos.LegalMobile }}
        </el-text>
      </p>
    </div>
    <div>
      <el-button type="success" @click="LicenseHandle">证照信息</el-button>
      <el-button type="warning" @click="InvoicingHandle">开票信息</el-button>
    </div>
    <el-divider />
    <div>
      <p>
        <el-text style="color: #999">客户所在行业：</el-text>
        <el-text style="color: #333">
          {{ CustomerInfos.IndustryShow }}
        </el-text>
      </p>
      <p>
        <el-text style="color: #999">主营产品：</el-text>
        <el-text style="color: #333">
          {{ CustomerInfos.SalesProducts }}
        </el-text>
      </p>
      <p>
        <el-text style="color: #999">主要销售区域：</el-text>
        <el-text style="color: #333">
          {{ CustomerInfos.SalesArea }}
        </el-text>
      </p>
      <p>
        <el-text style="color: #999">主要客户群体：</el-text>
        <el-text style="color: #333">
          {{ CustomerInfos.CustomerGroup }}
        </el-text>
      </p>
    </div>
  </div>
</template>

<script>
  export default defineComponent({
    name: 'CustomerInfo',
    setup() {
      const state = reactive({
        CustomerInfos: {},
      })

      const showInfo = (Info) => {
        state.CustomerInfos = Object.assign({}, Info)
      }

      return {
        ...toRefs(state),
        showInfo,
      }
    },
  })
</script>
